<template>
  <div>
    <el-form ref="dataForm" :model="form" class="el-dialog__body" label-width="100px">
      <div class="ledgerTitle">项目信息</div>
      <el-form-item label-width="100px" label="项目名称:" prop="projectName">
        {{form.projectName}}
      </el-form-item>
      <div class="ledgerTitle">基本信息</div>
      <component :is="auditView" :params="form" :edit="formDisplay"></component>
      <div class="ledgerTitle">审计情况</div>
      <el-row>
        <el-col>
          <el-form-item label="基本情况:">
            <pre class="pre-style">{{ form.basicInformation }}</pre>
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item label="审计期间收入支出（费用）情况:">
            <pre class="pre-style">{{ form.costsSituation }}</pre>
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item label="三公经费使用情况:">
            <pre class="pre-style">{{ form.costsUseSituation }}</pre>
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item label="内部管理制度建立及执行情况:">
            <pre class="pre-style">{{ form.implementSituation }}</pre>
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item label="工作业绩:">
            <pre class="pre-style">{{ form.workPerformance }}</pre>
          </el-form-item>
        </el-col>
      </el-row>
      <div class="ledgerTitle">问题记录及建议</div>
      <el-row>
        <el-col>
          <el-table
            ref="table"
            :data="tableData"
            :model="tableData"
            style="width: 100%"
            max-height="450"
            highlight-current-row
          >
            <el-table-column label="序号" width="100">
              <template #default="{ $index }">
                <span>{{ $index + 1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="问题标题">
              <template #default="{ row }">
                <pre class="pre-style">{{ row.problemTitle }}</pre>
              </template>
            </el-table-column>
            <el-table-column label="审计发现的主要问题">
              <template #default="{ row }">
                <pre class="pre-style">{{ row.problemDesc }}</pre>
              </template>
            </el-table-column>
            <el-table-column label="审计意见及建议">
              <template #default="{ row }">
                <pre class="pre-style">{{ row.suggestion }}</pre>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <div class="ledgerTitle">审计报告初稿</div>
      <el-row >
        <el-col :span="24">
          <el-form-item label-width="110px" label="审计取证单:" prop="projectName">
            <web-document :form-data="form" readWord="view" :pageType="'reportOpinion'" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>

import {getReport} from "@/api/adis/report/reportDraft";
import {mapGetters} from "vuex";
import WebDocument from "@/components/form/webDocument.vue";

export default {
  name: 'AuditReportOpinionView',
  props: {
    id: {
      type: String,
      default: ''
    },
    params: {
      type: Object,
    },
    isAudit: {
      type: Boolean,
      default: false,
    }
  },
  components: {WebDocument},
  dictTypes: ['audit_type'],
  computed:{
    ...mapGetters(["permissions"])
  },
  data() {
    return {
      isView:false,
      isAdvice:true,
      isReport:false,
      adviceForm:{
        auditStatus:'',
        createDate : `${new Date().getFullYear()}年${new Date().getMonth() + 1}月${new Date().getDate()}日`
      },
      form: {},
      tableData:[],
      formDisplay:false,
      auditView: 'ReportAuditTypeAuditView1',
    }
  },
  watch: {
    id: {
      handler(val) {
        if (val) {
          getReport(this.id).then((res)=>{
            if (res.data.data !== null){
              this.handleDraftResponse(res.data.data)
              this.$emit('data-loaded', true);
            } else {
              this.$emit('data-loaded', false);
            }
          }).catch(() => {
            this.$emit('data-loaded', false);
          })
        }
      },deep: true, immediate: true
    },
    params:{
      handler(val){
        if (val){
          this.handleDraftResponse(val)
        }
      },deep: true, immediate: true
    },
  },
  methods: {
    handleDraftResponse(val) {
      this.form = val;
      this.tableData = val.projectReportProblems;
      if(val.tenureStartDate && val.tenureEndDate) {
        this.form.employmentDates=[val.tenureStartDate, val.tenureEndDate];
      }
    },
    downWord() {
      if(!this.form.wordFile) {
        this.$message({
          type: "warning",
          message: "该项尚未上传相关文书!"
        });
        return;
      }
      const a = document.createElement('a');
      let url = this.form.wordFile;
      a.setAttribute('download', '');
      a.setAttribute('href', url);
      a.click();
    },
    openWord() {
      if(!this.form.wordFile) {
        this.$message({
          type: "warning",
          message: "该项尚未上传相关文书!"
        });
        return;
      }
      // this.$router.push({path:'/webOffice', query: {url: this.form.wordFile}})
      const { href } = this.$router.resolve({
        path: '/webOffice',
        query: {
          url: this.form.wordFile,
          type: this.isAudit ? 'edit' : 'view',
        }
      });
      window.open(href, '_blank');
    }
  }
}
</script>

